<template>
	<div style="width: 100vw;height: 15vh;">
		<van-tabbar v-model="active">
		  <van-tabbar-item icon="home-o" :dot="header" to="/">首页</van-tabbar-item>
		  <van-tabbar-item icon="comment-o" to="/forum" :dot="forum">论坛</van-tabbar-item>
		  <van-tabbar-item icon="shopping-cart-o" to="/cart" :dot="carter">购物车</van-tabbar-item>
		  <van-tabbar-item icon="friends-o" to="/mine" :dot="mines">我的</van-tabbar-item>
		</van-tabbar>
	</div>
</template>

<script>
	export default {
	  props:{
		  userName:{
			  type:Number,
			  required:true
		  },
		  userstate:{
			  type:Boolean,
			  required:true
		  }
	  },
	  data() {
	    return {
	      active: 0,
	      icon: {
	        active: 'https://img01.yzcdn.cn/vant/user-active.png',
	        inactive: 'https://img01.yzcdn.cn/vant/user-inactive.png',
	      },
		  header:true,
		  carter:false,
		  mines:false,
		  forum:false
	    };
	  },
	  created(){
		this.updateuserid() 
	  },
	  methods:{
		updateuserid(){
			console.log(this.userName)
			console.log(this.userstate)
			this.active=this.userName
			if(this.userName==2){
			  this.carter=this.userstate
			  this.header=false
			}
			if(this.userName==3){
			  this.mines=this.userstate
			  this.header=false
			}
			if(this.userName==1){
			  this.forum=this.userstate
			  this.header=false
			}
		}  
	  }
	};
</script>

<style>
</style>
